<template>
	<view class="content">
		<view class='headervw'>
			<text class='headertx'>
				{{title}}
			</text>
		</view>
		<view class="img_box" v-if="img && img!= ''">
			<image mode="widthFix" :src="img" class="activity_img"></image>
		</view>
		<rich-text :nodes="richText"></rich-text>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex';
	export default {
		data() {
			return {
				richText: '',
				title: '',
				img: ''
				// strings: '<p>点击订单进入订单列表, 在想要退款的订单下点击退款</p>'
			};
		},

		onLoad(options) {
			var item = JSON.parse(decodeURIComponent(options.item));
			this.title = item.title;
			var content = item.content;
			// content = content.replace(/<!DOCTYPE html>/g, "").replace(/<html>/g, "").replace(/<\/html>/g, "").replace(
			// 	/<head>/g, "").replace(/<\/head>/g, "").replace(/<body>/g, "").replace(/<\/body>/g, "");
			// //首页缩进，图片居中
			// var article = content.replace(/(\<img|\<p)/gi, function($0, $1) {
			// 	return {
			// 		"<img": '<img style="width:100%;height:auto;display:block;" ',
			// 		"<p": '<p style="text-indent: 2em;" ',
			// 		"<article": "<div",
			// 		"</article": "</div",
			// 		"<header": "<div",
			// 		"</header": "</div"
			// 	} [$1];
			// });
			this.richText = this.$api.htmlParser.parseHtml(content);
			console.log('-----richText--------',this.richText)
			this.img = item.coverImageUrl
		},
		computed: {
			...mapState(['hasLogin', 'userInfo'])
		},
		methods: {
			...mapMutations(['login']),

		},
	}
</script>

<style lang="scss">
	.content {
		background: #fff;
		padding: 30upx;
	}

	.headervw {
		width: 100%;
		// height: 60upx;
		text-align: center;
		margin-bottom: 30upx;
	}

	.headertx {
		font-size: 36upx;
		font-weight: bold;
		// line-height: 60upx;
	}

	.img_box {
		text-align: center;
		margin-bottom: 20upx;
		// border-radius: 10upx;
		// background-color: #666666;
		// height: 300upx;
	}

	.activity_img {
		width: 100%;
		height: 100%;
		border-radius: 10upx;
	}
</style>
